<html>
  <meta charset="utf-8">
  <head>
    <title>The Index</title>
  </head>
  <style>form {display: inline}</style>
  <h1>The Index</h1>
  <p>This page includes several different kinds of link.</p>
  <h2>Pages whose links appear in the HTML</h2>
  <p>
    This paragraph element includes a literal inline link to
    <a href="/page1.html">page 1</a> and another link to
    <a href="/page2.html">page 2</a>.
  </p>
  <h2>Pages that are only accessible through forms</h2>
  <p>
    There is a search that this site can return:
    <form action="/search.html">
      <input name="q" type="hidden" value="A">
      <button type="submit">Search</button>
    </form>
  </p>
  <h2>Pages whose elements are loaded through JavaScript</h2>
  <p>
    The following div element is populated through a callback.
  </p>
  <div id="later"></div>
  <script>
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
      if (xhr.readyState !== 4)
        return;
      var text = xhr.responseText;
      console.log(text);
      document.getElementById('later').innerHTML = text;
    };
    xhr.open('GET', '/further.html');
    xhr.send('');
  </script>
  <p>
    <a name="end">The first four words</a> of this final paragraph are
    an anchor element that has no <tt>href</tt> attribute because it
    exists only to provide a name by which this paragraph can be
    referenced from a URL fragment — not to point anywhere else.
  </p>
</html>
